import React, { useEffect } from 'react';
import main from '../../main';
import { copyToClipboard } from '../../utils/utils';

interface Props {
  title?: string;
  // text: string;
  confirmText?: string;
  onClose: () => void;
}

export default function NotWxPageDialog({ title = '温馨提示', confirmText = '确认', onClose }: Props) {
  useEffect(() => {
    window.document.body.style.overflow = 'hidden';
  }, []);

  function handleCopyHost() {
    let url = window.location.href;
    copyToClipboard(url);
  }
  function handleClose() {
    
    window.document.body.style.overflow = '';
    let uri = window.location.href;
    handleCopyHost()
    let redirect_uri = encodeURIComponent(uri);
    const authUrl = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=${main.appId}&redirect_uri=${redirect_uri}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect`;
    // document.location.replace(authUrl);
    // if(window.location.search.includes('code'))
    onClose();
  }
  return (
    <div className="wrong-dialog d-flex-r ai-center jc-center">
      <div className="wrong-mask" />
      <div className="bw-100 wrong-center" onClick={() => {}}>
        <div className="wrong-title-block">
          <div className="flex-1 d-flex-r ai-center jc-center pt-20">
            <img className="w-30 mr-10" src="./pic/icon_cancel.png" alt="" />

            <span className="font-size-14 font-widget-600">{title}</span>
          </div>
         
        </div>
        <div className="wrong-content d-flex-c ai-center jc-center">
          <div className="flex-1 bw-100 d-flex-c ai-center jc-center">
            {/* <div className="flex-1 d-flex-r ai-center jc-center">{text}</div> */}
            <div className="mb-5 font-size-12 text-color-9">此链接需要在微信中打开，请点击复制链接到微信环境打开！</div>
          </div>
          <div className="bw-100 h-40 border-top d-flex-r ai-center jc-center text-color-p" onClick={handleClose}>
            {confirmText}
          </div>
        </div>
      </div>
    </div>
  );
}
